import { CSSProperties } from 'vue'
import { PopoverProps, ButtonProps, TooltipInstance } from 'element-plus'
import { IconPropsType, MaskPropsType } from '@xtail/vue3'
import { IconPickerPropsType } from '../XIconPicker'

export const IconSelectorPropsType_Name = 'IconSelectorPropsType'

export type IconSelectorPropsType = IconPickerPropsType & {
  // popover Props
  popoverProps?: Partial<PopoverProps>
  // trigger btn props
  triggerBtnProps?: Partial<ButtonProps>
  // trigger btn icon class
  triggerBtnIconClass?: string | string[]
  // trigger btn icon style
  triggerBtnIconStyle?: string | Partial<CSSProperties>
  // preview trigger tooltip props
  previewTriggerTooltipProps?: Partial<TooltipInstance['$props']>
  // preview trigger icon props
  previewTriggerIconProps?: IconPropsType
  // preview trigger icon class
  previewTriggerIconClass?: string | string[]
  // preview trigger icon style
  previewTriggerIconStyle?: string | Partial<CSSProperties>
  // mask props
  maskProps?: Omit<MaskPropsType, 'value' | 'onUpdate:value' | 'modelValue' | 'onUpdate:modelValue'>
  // preview icon scale
  previewIconScale?: number
  // preview icon class
  previewIconClass?: string | string[]
  // preview icon style
  previewIconStyle?: string | Partial<CSSProperties>
}
